import React,{Component} from 'react';
import {render} from 'react-dom';
import  './main.css'

const derame= ["学会理财,保持在13%","存款10w","摄影","去过周边国家","去西藏","去新疆"];
const remain = Math.round( ((new Date(2021,4,6)).getTime() - (new Date()).getTime())/(1000*60*60*24))
const dreamIng = ["理财30%"]
class thirty extends Component{

render(){
  let rate = '1%'
  return (
    <div className="thirty" >
       <h3 className= "center">离30岁还有:<span>{remain}天</span> ~~ 约<span>{Math.round(remain/30)}月</span>~~ 约<span>{(remain/365).toFixed(2)}年</span></h3>
       <h3 className= "center">目标完成<span>{rate}</span></h3>
       <section>
         <h4>目标进行时\已经完成：</h4>
         <div>
           {
             React.Children.map(dreamIng,(item,i) => {
               return(<span>{item}，</span>)
             })
           }
         </div>
         <h4>具体目标：</h4>
         <div>
           {
             React.Children.map(derame,(item,i)=>{
                return <span>{item}，</span>
            })
           }
         </div>
         
       </section>
    </div>
  )
}
}

export default thirty